<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<jsp:root xmlns:jsp="http://java.sun.com/JSP/Page"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:p="http://primefaces.org/ui"
	xmlns:c="http://java.sun.com/jstl/core">
	<link rel="stylesheet" type="text/css"
		href="${request.contextPath}/theme/login.css" title="Style" />
	
	<script type="text/javascript">
		function limpiarMessageError1(){
			document.getElementById("formLogin:idUsuarioError").innerHTML='';
			document.getElementById("formLogin:idMessageError").innerHTML='';
		}
		
		function limpiarMessageError2(){
			document.getElementById("formLogin:idClaveError").innerHTML='';
			document.getElementById("formLogin:idMessageError").innerHTML='';
		}
	</script>

	<html>
		<f:event type="preRenderView" listener="#{accesoController.onPageLoad}"/>
		<h:form styleClass="form" id="formLogin">
			<div>
				<br />
				<br />
				<table cellSpacing="0" cellPadding="0" border="1"
					style="height: 225px; width: 586px;" align="center">
					<tbody>
						<tr>
							<td>
								<table style="WIDTH: 600px; BACKGROUND-COLOR: white">
									<tr>
										<td colspan="6" style="text-align: left"><h:graphicImage
											style="BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; WIDTH: 600px; HEIGHT: 79px; BORDER-RIGHT-WIDTH: 0px"
											id="image2" value="imagenes/banner/bannerBBVA3.png"></h:graphicImage>
										</td>
									</tr>
									<tr>
										<td rowspan="1" style="width: 100px; text-align: left"><h:graphicImage
											style="BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; WIDTH: 350px; HEIGHT: 221px; BORDER-RIGHT-WIDTH: 0px"
											id="Image1" value="imagenes/banner/loginGK.jpg"></h:graphicImage>
										</td>
										<td colspan="5" valign="middle">
											<table id="TABLE1">
												<tr align="center">
													<td colspan="5"><h:outputText id="Label2"
															value="Ingreso al Sistema" styleClass="TextoAzul"></h:outputText>
													</td>
												</tr>
												<tr>
													<td style="width: 100px; height: 10px"></td>
													<td colspan="3" style="height: 10px"></td>
													<td style="width: 100px; height: 10px"></td>
												</tr>
												<tr align="left">
													<td style="width: 100px" />
													<td style="width: 100px; text-align: right">
														<h:outputText id="Label1" value="Usuario:" styleClass="TextoAzul" />
													</td>
													<td style="width: 16px" />
													<td style="width: 132px">
														<h:inputText id="txtUsuario" size="7" maxlength="7" required="true" onkeyup="limpiarMessageError1()"
															style="width: 132px" value="#{accesoController.usuario}" label="Usuario"/>
													</td>
												</tr>
												<tr align="left">
													<td style="width: 100px" />
													<td style="width: 100px;" />
													<td style="width: 16px" />
													<td style="width: 132px">
														<h:message for="txtUsuario" style="color:red" id="idUsuarioError"/>
													</td>
												</tr>
												<tr align="left">
													<td style="width: 100px" />
													<td style="width: 100px; text-align: right">
														<h:outputText id="Label3" value="Clave:" styleClass="TextoAzul" />
													</td>
													<td style="width: 16px" />
													<td style="width: 132px">
														<h:inputSecret id="txtPassword" maxlength="8" size="8" required="true" onkeyup="limpiarMessageError2()"
															style="width: 132px" value="#{accesoController.password}" label="Clave"/>
													</td>
												</tr>
												<tr align="left">
													<td style="width: 100px" />
													<td style="width: 100px;" />
													<td style="width: 16px" />
													<td style="width: 132px">
														<div>
															<h:message for="txtPassword" style="color:red" id="idClaveError"/>
														</div>
													</td>
												</tr>
												<tr>
													<td style="width: 100px" />
													<td style="width: 248px" align="center" colspan="3">
														<h:outputText value="#{accesoController.messageErrorLogin}" style="color:red" id="idMessageError"/>
													</td>
												</tr>
												<tr>
													<td style="width: 100px; height: 11px" />
													<td style="width: 100px; height: 11px;" />
													<td style="width: 16px; height: 11px" />
													<td style="width: 132px; height: 11px" />
												</tr>
												<tr>
													<td colspan="5" align="center">
														<h:commandButton styleClass="btnAceptar" action="#{accesoController.login}" value=""/> 
														<h:commandButton styleClass="btnCancelar" id="btnReset" onclick="window.close();" value=""/>
													</td>
												</tr>
											</table>
										</td>
									</tr>
									<tr>
										<td colspan="6" rowspan="1" id="Pie"></td>
									</tr>
								</table>
							</td>
						</tr>
					</tbody>
				</table>
			</div>
		</h:form>
	</html>
</jsp:root>
